<style lang="less">
  // .main .content-wrapper {
  //   padding: 0;
  //   height: calc(100% - 80px);
  //   overflow: auto;
  // }
  .card_style {
    height: 100%;
    width: 100%;
    overflow: hidden;
    .ivu-card-body {
      padding: 0px;
    }
  }
  .page_style {
    margin-top: 10px;
    text-align: right;
  }
  .bench_search {
    margin-bottom: 10px;
  }
  .nopadding .ivu-table-cell {
    padding: 0px 0px;
  }
  .item1{
    height: 42px;
    line-height: 40px;
  }
  .new-btn-sty {
    margin-right: 5px;
    color: #fff;
    background-color: #235CA7;
    border-color: #235CA7;
    font-weight: 500;
  }
</style>

<template>
  <Card class="card_style" :bordered="false" :dis-hover="true">
    <Tabs value="name1" @on-click="changeTab" v-model="tab_index">
      <TabPane :label="'知识库('+totalnum+')'" name="0" >
        <Row class="bench_search">
          <Col span="6">
            <span>标题：</span>
            <Input style="width: 70%;" v-model="searchInfo.knowledge_title" />
          </Col>
          <Button class="new-btn-sty" @click="modal2 = true" style="margin-right:10px" v-if="companyCode === 'LM'"><Icon type="ios-search" /> 创建</Button>
          <Modal v-model="modal2" title="录入基本信息" width="700" cancel-text="关闭"
            @on-ok="ok111(paramData2)" @on-cancel="modal2 = false" ok-text="确定" style="position:relative;">
            <Form ref="paramData" :model="paramData2"  >
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">类型:</Col>
                <Col span="12">
                  <Input v-model="paramData2.knowledge_type" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">标题:</Col>
                <Col span="12">
                  <Input v-model="paramData2.knowledge_title" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1" style="height:auto;line-height:auto">
                <Col span="5" style="text-align: center" class="">内容:</Col>
                <Col span="12">
                  <Input v-model="paramData2.knowledge_content" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder=""></Input>
                </Col>
              </Row>
            </Form>
          </Modal>
          <Modal v-model="modal" title="编辑基本信息" width="700" cancel-text="关闭"
            @on-ok="ok111(paramData)" @on-cancel="modal = false" ok-text="确定" style="position:relative;">
            <Form ref="paramData" :model="paramData"  >
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">类型:</Col>
                <Col span="12">
                  <Input v-model="paramData.knowledge_type" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">标题:</Col>
                <Col span="12">
                  <Input v-model="paramData.knowledge_title" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1" style="height:auto;line-height:auto">
                <Col span="5" style="text-align: center" class="">内容:</Col>
                <Col span="12">
                  <Input v-model="paramData.knowledge_content" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder=""></Input>
                </Col>
              </Row>
              <!-- <Row class="item1">
                <Col span="5" style="text-align: center" class="">发布人:</Col>
                <Col span="12">
                  <Input v-model="paramData.create_by" placeholder=""></Input>
                </Col>
              </Row> -->
            </Form>
          </Modal>
          <Modal v-model="modal1" title="详情" width="700" cancel-text="关闭"
            @on-cancel="modal = false" ok-text="确定" style="position:relative;">
            <Form ref="paramData" :model="paramData"  >
              <Row class="item1">
                <Col span="6" style="text-align: right" class="">类型:</Col>
                <Col span="12" offset="1">{{paramData.knowledge_type}}</Col>
              </Row>
              <Row class="item1">
                <Col span="6" style="text-align: right" class="red-name">标题:</Col>
                <Col span="12" offset="1">{{paramData.knowledge_title}}</Col>
              </Row>
              <Row class="item1" style="height:auto;line-height:auto">
                <Col span="6" style="text-align: right" class="">内容:</Col>
                <Col span="12" offset="1">{{paramData.knowledge_content}}</Col>
              </Row>
              <Row class="item1">
                <Col span="6" style="text-align: right" class="red-name">发布人:</Col>
                <Col span="12" offset="1">{{paramData.create_by}}</Col>
              </Row>
            </Form>
          </Modal>
          <Button class="new-btn-sty" @click="searchData(false)"><Icon type="ios-search" /> 搜索</Button>
        </Row>
        <div style="margin-top: 20px">
          <Table border :columns="columns1" :data="datalist"></Table>
          <Row v-if="loadData == true">
            <Col class="demo-spin-col" span="8" offset="8">
              <Spin fix>
                <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
                <div>数据正在加载</div>
              </Spin>
            </Col>
          </Row>
        </div>
        <div  class="page">
          <Page :total="totalnum" :current="currentPageNo" :page-size="currentPageSize" @on-change="change" class="page_style"/>
        </div>
      </TabPane>
      <TabPane :label="'咨询('+totalnum2+')'" name="1" v-if="companyCode === 'LM40002'">
        <Row class="bench_search">
          <Col span="6">
            <span>标题：</span>
            <Input style="width: 70%;" v-model="searchInfo.knowledge_title" />
          </Col>
          <Modal v-model="modal2" title="录入基本信息" width="700" cancel-text="关闭"
            @on-ok="ok111(paramData2)" @on-cancel="modal2 = false" ok-text="确定" style="position:relative;">
            <Form ref="paramData" :model="paramData2"  >
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">类型:</Col>
                <Col span="12">
                  <Input v-model="paramData2.knowledge_type" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">标题:</Col>
                <Col span="12">
                  <Input v-model="paramData2.knowledge_title" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1" style="height:auto;line-height:auto">
                <Col span="5" style="text-align: center" class="">内容:</Col>
                <Col span="12">
                  <Input v-model="paramData2.knowledge_content" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder=""></Input>
                </Col>
              </Row>
            </Form>
          </Modal>
          <Modal v-model="modal" title="编辑基本信息" width="700" cancel-text="关闭"
            @on-ok="ok111(paramData)" @on-cancel="modal = false" ok-text="确定" style="position:relative;">
            <Form ref="paramData" :model="paramData"  >
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">类型:</Col>
                <Col span="12">
                  <Input v-model="paramData.knowledge_type" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1">
                <Col span="5" style="text-align: center" class="">标题:</Col>
                <Col span="12">
                  <Input v-model="paramData.knowledge_title" placeholder=""></Input>
                </Col>
              </Row>
              <Row class="item1" style="height:auto;line-height:auto">
                <Col span="5" style="text-align: center" class="">内容:</Col>
                <Col span="12">
                  <Input v-model="paramData.knowledge_content" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder=""></Input>
                </Col>
              </Row>
              <!-- <Row class="item1">
                <Col span="5" style="text-align: center" class="">发布人:</Col>
                <Col span="12">
                  <Input v-model="paramData.create_by" placeholder=""></Input>
                </Col>
              </Row> -->
            </Form>
          </Modal>
          <Modal v-model="modal1" title="详情" width="700" cancel-text="关闭"
            @on-cancel="modal = false" ok-text="确定" style="position:relative;">
            <Form ref="paramData" :model="paramData"  >
              <Row class="item1">
                <Col span="6" style="text-align: right" class="">类型:</Col>
                <Col span="12" offset="1">{{paramData.knowledge_type}}</Col>
              </Row>
              <Row class="item1">
                <Col span="6" style="text-align: right" class="red-name">标题:</Col>
                <Col span="12" offset="1">{{paramData.knowledge_title}}</Col>
              </Row>
              <Row class="item1" style="height:auto;line-height:auto">
                <Col span="6" style="text-align: right" class="">内容:</Col>
                <Col span="12" offset="1">{{paramData.knowledge_content}}</Col>
              </Row>
              <Row class="item1">
                <Col span="6" style="text-align: right" class="red-name">发布人:</Col>
                <Col span="12" offset="1">{{paramData.create_by}}</Col>
              </Row>
            </Form>
          </Modal>
          <Button class="new-btn-sty" @click="searchData(false)"><Icon type="ios-search" /> 搜索</Button>
        </Row>
        <div style="margin-top: 20px">
          <Table border :columns="columns2" :data="datalist1"></Table>
          <Row v-if="loadData == true">
            <Col class="demo-spin-col" span="8" offset="8">
              <Spin fix>
                <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
                <div>数据正在加载</div>
              </Spin>
            </Col>
          </Row>
        </div>
        <div  class="page">
          <Page :total="totalnum" :current="currentPageNo" :page-size="currentPageSize" @on-change="change" class="page_style"/>
        </div>
      </TabPane>
    </Tabs>
  </Card>
</template>
<script>
import { knowledgeList, createKnowledge, getKnowledgeInfo, delKnowledge } from '@/api/eventlist'

export default {
  name: 'knowledgebase',
  data () {
    return {
      loadData: true,
      modal: false,
      modal1: false,
      modal2: false,
      params: {
        pageNo: '',
        pageSize: '',
        type: ''
      },
      params1: {
        pageNo: '',
        pageSize: '',
        type: ''
      },
      searchInfo: {
        knowledge_type: '',
        knowledge_title: ''
      },
      paramData: {
        knowledge_type: '',
        knowledge_title: '',
        knowledge_content: '',
        create_by: ''
      },
      paramData2: {
        knowledge_type: '',
        knowledge_title: '',
        knowledge_content: '',
        create_by: ''
      },
      currentPageNo: 1,
      currentPageSize: 10,
      selectstr: '',
      applyname: '',
      title: '',
      applytime: [],
      totalnum: 0,
      totalnum2: 0,
      tab_index: 0,
      columns1: [
        { title: '序号', type: 'index', width: 70, align: 'center' },
        { title: '标题', key: 'knowledge_title', width: 250, align: 'center', resizable: true },
        { title: '发布人', key: 'create_by', width: 220, align: 'center', resizable: true },
        { title: '发布时间', key: 'create_time', width: 220, align: 'center' },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          className: 'nopadding',
          minWidth: 100,
          render: (h, params) => {
            let company_code = this.$store.state.user.severUserInfo.company_code
            console.log(company_code)
            let abc = [h('Button', {
              props: {
                type: 'primary',
                size: 'small'
              },
              style: {
                marginRight: '5px',
                backgroundColor: '#598ED1 ',
                borderColor: '#598ED1'
              },
              on: {
                click: () => {
                  this.show(params.row)
                }
              }
            }, '编辑'),
            h('Button', {
              props: {
                type: 'info',
                size: 'small'
              },
              style: {
                marginRight: '5px',
                backgroundColor: '#235CA7',
                borderColor: '#235CA7'
              },
              on: {
                click: () => {
                  this.showInfo(params.row)
                }
              }
            }, '详情'),
            h('Button', {
              props: {
                type: 'error',
                size: 'small'
              },
              on: {
                click: () => {
                  this.remove(params.row)
                }
              }
            }, '删除')]
            if (company_code !== 'LM') {
              abc = [h('Button', {
                props: {
                  type: 'info',
                  size: 'small'
                },
                style: {
                  marginRight: '5px',
                  backgroundColor: '#235CA7',
                  borderColor: '#235CA7'
                },
                on: {
                  click: () => {
                    this.showInfo(params.row)
                  }
                }
              }, '详情')]
            }
            return h('div', abc)
          }
        }
      ],
      columns2: [
        { title: '序号', type: 'index', width: 70, align: 'center' },
        { title: '标题', key: 'knowledge_title', width: 250, align: 'center', resizable: true },
        { title: '发布人', key: 'create_by', width: 220, align: 'center', resizable: true },
        { title: '发布时间', key: 'create_time', width: 220, align: 'center' },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          className: 'nopadding',
          minWidth: 100,
          render: (h, params) => {
            let company_code = this.$store.state.user.severUserInfo.company_code
            console.log(company_code)
            let abc = [h('Button', {
              props: {
                type: 'info',
                size: 'small'
              },
              style: {
                marginRight: '5px',
                backgroundColor: '#235CA7',
                borderColor: '#235CA7'
              },
              on: {
                click: () => {
                  this.showInfo(params.row)
                }
              }
            }, '详情')]
            return h('div', abc)
          }
        }
      ],
      datalist: [],
      datalist1: [],
      modalInfo: {},
      company_list: [
        { id: 1, company_name: '演示社区1', company_code: 'L0002' },
        { id: 2, company_name: '演示社区2', company_code: 'LW12345' },
        { id: 3, company_name: '皇姑区明廉街道中海西社区', company_code: 'LA00690' },
        { id: 4, company_name: '沈河区山东庙街道三办南社区', company_code: 'LA00697' }
      ]
    }
  },
  computed: {
    companyCode () {
      return this.$store.state.user.severUserInfo.company_code
    }
  },
  methods: {
    // 计算表达式的值
    evil (fn) {
      var Fn = Function
      return new Fn('return ' + fn)()
    },
    // 查询订单列表接口
    init (param) {
      param.pageNo = this.currentPageNo
      param.pageSize = this.currentPageSize
      // param.type = this.tab_index
      knowledgeList(param).then(res => {
        console.log(res.data.data)
        if (res.data.errcode === 0) {
          this.datalist = res.data.data.results
          this.loadData = false
          this.totalnum = res.data.data.totalRecord
        } else {
          this.loadData = true
          this.$Notice.error({
            title: '获取知识库列表失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    initList (param) {
      param.pageNo = this.currentPageNo
      param.pageSize = this.currentPageSize
      knowledgeList(param).then(res => {
        console.log(res.data.data)
        if (res.data.errcode === 0) {
          this.datalist1 = res.data.data.results
          this.loadData = false
          this.totalnum2 = res.data.data.totalRecord
        } else {
          this.$Notice.error({
            title: '获取咨询列表失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    ok111 (param) {
      param.type = '0'
      createKnowledge(param).then(res => {
        console.log(res.data.errcode)
        if (res.data.errcode === 0) {
          this.init(this.params)
          this.$Notice.success({ title: '成功', desc: '' })
        } else {
          this.$Notice.error({ title: '失败', desc: res.data.errmsg })
        }
      })
    },
    showInfo (item) {
      this.modal1 = true
      console.log(item)
      var param = {
        id: item.id
      }
      getKnowledgeInfo(param).then(res => {
        console.log(res)
        if (res.data.errcode === 0) {
          this.paramData = res.data.data
          return
        }
        this.$Notice.error({ title: '数据获取失败', desc: res.errmsg })
      })
    },
    show (item) {
      this.modal = true
      console.log(item)
      var param = {
        id: item.id
      }
      getKnowledgeInfo(param).then(res => {
        console.log(res)
        if (res.data.errcode === 0) {
          this.paramData = res.data.data
          return
        }
        this.$Notice.error({ title: '数据获取失败', desc: res.errmsg })
      })
    },
    remove (item) {
      var param = {
        id: item.id
      }
      if (confirm('确定删除该条数据吗')) {
        delKnowledge(param).then(res => {
          console.log(res.data)
          if (res.data.errcode === 0) {
            this.init(this.params)
            return
          }
          this.$Notice.error({ title: '删除失败', desc: res.errmsg })
        })
      }
    },
    searchData (index) {
      let params = {
        // knowledge_type: this.searchInfo.knowledge_type,
        knowledge_title: this.searchInfo.knowledge_title
        // type: this.tab_index
      }
      this.init(params)
      // this.initList(params)
      this.currentPageNo = 1
      if (this.tab_index === '0') {
        this.init(params)
      } else if (this.tab_index === '1') {
        this.initList(params)
      }
      // this.init(params)
    },
    change (pageNo) {
      this.currentPageNo = pageNo
      let params = {
        knowledge_type: this.searchInfo.knowledge_type,
        knowledge_title: this.searchInfo.knowledge_title
      }
      this.init(params)
    },
    // 修改订单信息
    updateInfo (item) {
      if (item.item_id === '11210101000000MZJD5212000330000') {
        this.$router.push({
          name: 'subsistenceapplication',
          params: {
            cardno: item.cardno,
            code: item.code
          }
        })
      } else {
        this.$router.push({
          name: 'handinformation',
          params: {
            itemid: item.item_id,
            cardno: item.cardno,
            code: item.code,
            cur_data: { tabindex: this.tab_index, pageNo: this.currentPageNo }
          }
        })
      }
    },
    // 弹出框功能，流程中需要填写信息的按钮
    popModal (item, modal, key) {
      this.modalInfo = {
        show: true,
        process_id: item.state,
        key: key,
        code: item.code,
        title: item.title + '-' + modal.name,
        params_type: modal.params_type,
        params_code: modal.params_code,
        next_process_id: modal.next_process_id,
        params_name: modal.params_name
      }
    },
    // 弹出框功能，填写信息后确定按钮
    acceptBtn () {
      let aaa = {
        code: this.modalInfo.code,
        key: this.modalInfo.key,
        state: this.modalInfo.process_id
      }
      if (this.modalInfo.params_code.indexOf('_') === 0) {
        aaa[this.modalInfo.params_code.substring(1)] = this.modalInfo.text
      } else {
        let params = {
          params_type: this.modalInfo.params_type,
          params_name: this.modalInfo.params_name,
          params_code: this.modalInfo.params_code,
          text: this.modalInfo.text
        }
        aaa.params = JSON.stringify(params)
      }
      setorderapply(aaa).then(res => {
        if (res.data.data) {
          this.init({ 'state': aaa.state })
          this.initTabCount()
        } else {
          this.$Notice.error({
            title: '获取事项列表失败',
            desc: res.data.errmsg
          })
        }
      })
    },
    // 切换tab页
    changeTab (name) {
      this.currentPageNo = 1
      this.currentpageSize = 10
      console.log(this.tab_index, 'tab页')
      var param = {
        pageNo: this.currentPageNo,
        pageSize: this.currentpageSize,
        type: this.tab_index
      }
      if (this.tab_index === '0') {
        this.init(param)
      } else if (this.tab_index === '1') {
        this.initList(param)
      }
    }
  },
  mounted () {
    this.init(this.params)
    this.initList(this.params1)
  }
}
</script>
